<!doctype html>
<html class="no-js" lang="">
    <head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html">
        
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>mashangpai</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

		<!-- favicon
		============================================ -->		
        
		
		<!-- Google Fonts
		============================================ -->		
		<link href='../../../../css-OpenSans20030040050060070080.css' rel='stylesheet' type='text/css'>
	   
		<!-- Bootstrap CSS
		============================================ -->		
        <link rel="stylesheet" href="css/bootstrap.min.css">
		<!-- Font Awesome CSS
		============================================ -->
        <link rel="stylesheet" href="css/font-awesome.min.css">
		<!-- Mean Menu CSS
		============================================ -->      
        <link rel="stylesheet" href="css/meanmenu.min.css">
		<!-- owl.carousel CSS
		============================================ -->
        <link rel="stylesheet" href="css/owl.carousel.css">
        <link rel="stylesheet" href="css/owl.theme.css">
        <link rel="stylesheet" href="css/owl.transitions.css">
		<!-- nivo-slider css
		============================================ --> 
		<link rel="stylesheet" href="css/nivo-slider.css">
		<!-- Price slider css
		============================================ --> 
		<link rel="stylesheet" href="css/jquery-ui-slider.css">
		<!-- Simple Lence css
		============================================ --> 
		<link rel="stylesheet" type="text/css" href="css/jquery.simpleLens.css">
		<link rel="stylesheet" type="text/css" href="css/jquery.simpleGallery.css">
		<!-- normalize CSS
		============================================ -->
        <link rel="stylesheet" href="css/normalize.css">
		<!-- main CSS
		============================================ -->
        <link rel="stylesheet" href="css/main.css">
		<!-- style CSS
		============================================ -->
        <link rel="stylesheet" href="style.css">
		<!-- responsive CSS
		============================================ -->
        <link rel="stylesheet" href="css/responsive.css">
		<!-- modernizr JS
		============================================ -->		
        <script src="js/vendor/modernizr-2.8.3.min.js"></script>
    </head>
    <body>
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->
		<div id="header11"></div>
		<div class="breadcurb-area">
			<div class="container">
				<ul class="breadcrumb">
					<li class="home"><a href="index.html">首页</a></li>
					<li>我的收藏</li>
				</ul>
			</div>
		</div><!-- End Breadcurb Area -->
		<div class="chart-area" >
<!--			{{items}}-->

			<div class="container" id="item_box">
				<div class="row">
					<div class="col-md-12">
						<!-- Cart Item -->
						<div class="chart-item table-responsive fix">
							<table class="col-md-12">
								<thead>
									<tr>
										<th class="th-product">商品</th>
										<th class="th-details">商品详情</th>
										<th class="th-status">商品状态</th>
										<th class="th-price">起拍价</th>
										<th class="th-time">拍卖时间</th>
										<th class="th-operate">商品操作</th>
									</tr>
								</thead>
								<tbody>
								<template v-for="item in items">
								<tr>
									<td class="th-product">
										<a href=""><img v-bind:src="item.url" alt="cart"></a>
									</td>
									<td class="th-details">
										<h2><a href="">{{item.gname}}</a></h2>
									</td>
									<td class="th-status">
										<template v-if="item.status === 1">
											审核中
										</template>
										<template v-else-if="item.status === 2">
											公示期
										</template>
									</td>
									<td class="th-price">￥{{item.price}}</td>
									<td class="th-time">
										<h4>开始时间：{{item.start}}</h4>
										<h4>结束时间：{{item.stop}}</h4>
									</td>
									<td class="th-operate">
										<button type="button" class="btn custom-button"><a @click="changeUrl(item.gid)"><span style="color: white">商品详情</span></a></button>
										<hr>
										<button type="button" class="btn custom-button"><a @click="noEnshrine(item.gid)"><span style="color: white">取消收藏</span></a></button>
									</td>
								</tr>

								</template>
								</tbody>
							</table>
						</div><!-- End Cart Item -->
						<!--<div class="shoping-cart-button">-->
							
							<div align="center" >
							    <nav aria-label="...">
									  <ul class="pagination">
									    <li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li>
									    <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
									    <li class="disabled"><a href="#">2 <span class="sr-only">(current)</span></a></li>
									    <li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">&raquo;</span></a></li>
									  </ul>
									</nav>
							</div>
						<!--</div>-->
					</div>
				</div>
		<!-- My Account Area -->
		</div>
		</div>
        <div id="footer11"></div>
				
		
		
		
		
		
		<!-- jquery
		============================================ -->		
        <script src="js/vendor/jquery-1.11.3.min.js"></script>
		<!-- bootstrap JS
		============================================ -->		
        <script src="js/bootstrap.min.js"></script>
		<!-- nivo slider js
		============================================ --> 
		<script src="js/jquery.nivo.slider.pack.js"></script>
		<!-- Mean Menu js
		============================================ -->         
        <script src="js/jquery.meanmenu.min.js"></script>
		<!-- price-slider JS
		============================================ -->		
        <script src="js/jquery-price-slider.js"></script>
		<!-- Simple Lence JS
		============================================ -->
		<script type="text/javascript" src="js/jquery.simpleGallery.min.js"></script>
		<script type="text/javascript" src="js/jquery.simpleLens.min.js"></script>	
		<!-- owl.carousel JS
		============================================ -->		
        <script src="js/owl.carousel.min.js"></script>
		<!-- scrollUp JS
		============================================ -->		
        <script src="js/jquery.scrollUp.min.js"></script>
		<!-- DB Click JS
		============================================ -->
        <script src="js/dbclick.min.js"></script>
		<!-- Countdown JS
		============================================ -->
        <script src="js/jquery.countdown.min.js"></script>
		<!-- plugins JS
		============================================ -->		
        <script src="js/plugins.js"></script>
		<!-- main JS
		============================================ -->		
        <script src="js/main.js"></script>
		<!--vue adios-->
		<script src="js/vue.min.js"></script>
		<script src="js/axios.js"></script>
        <script>
		 $(function() {
                $('#header11').load("auction-head.html");
                $('#footer11').load('auction-footer.html');
         });
		 var vm = new Vue({
			 el: '#item_box',
			 data(){
				 return {
				 	items: null, id: 100,
				 	pageNum:1, pageSize:5}
			 },
			 methods:{
				 changeUrl: function(gid){
					 window.location.href = "product-details.html?gid=" + gid;
				 },
				 noEnshrine:function (gid) {
					 var temp=this;
					 axios.post('/web-goods/buyer/noEnshrine/'+gid+"/")
							 .then(
							 		function(){
										 axios
												 .get('/web-goods/buyer/myEnshrine/'+1+"/"+8+"/")
												 .then(response => (temp.items = response.data.data))
												 .catch(function (error) { // 请求失败处理
													 alert(error);
													 console.log(error);
												 });
									 },
									alert("取消成功")
							 )
							 .catch(function (error) { // 请求失败处理
								 alert(error);
								 console.log(error);
							 });
				 }
			 },
			 mounted () {
			 	var temp = this;
				 axios
						 .get('/web-goods/buyer/myEnshrine/'+this.pageNum+"/"+this.pageSize+"/")
						 .then(
					              response => {
									  if (response.data.code == 200) {
										  temp.items = response.data.data
									  } else if(response.data.code == 300){
										  window.location.href = "login.html";
									  }
								  }
			             )
			 			 .catch(function (error) { // 请求失败处理
							 alert(error);
							 console.log(error);
						 });
			 }
		 })
		</script>
    </body>
    
</html>
